<template>
	<view>
		<view class="c-box">
			<u-row gutter="16">
				<u-col span="3" v-for="(item, index) in list" :key="index" @click="toPath(item)">
					<view>
						<view class="img-b fcc">
							<image class="img" :src="item.img" mode="widthFix"></image>
						</view>
						<view class="title fcc">
							{{ item.title }}
						</view>
					</view>
				</u-col>
			</u-row>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [
					{
						title: '权限管理',
						img: require('@/static/img/set-1.png'),
						path: '/pages/Permissions/index'
					},
					{
						title: '商户信息',
						img: require('@/static/img/set-2.png'),
						path:'/pages/Business_Information/index'
					},
					{
						title: '店铺设置',
						img: require('@/static/img/set-3.png'),
						path:'/pages/store_settings/index'
					},
					{
						title: '运费管理',
						img: require('@/static/img/set-4.png'),
						path: '/pages/set/freight/freight'
					},
					{
						title: '打印机管理',
						img: require('@/static/img/set-5.png'),
						path: '/pages/set/printer/printer'
					},
					{
						title: '素材管理',
						img: require('@/static/img/set-6.png'),
						path: '/pages/set/material/material'
					},
					{
						title: '数据分析',
						img: require('@/static/img/set-7.png'),
						path: '/pages/set/data-analysis/data-analysis'
					},
					{
						title: '公告消息',
						img: require('@/static/img/set-8.png'),
						path: '/pages/set/announcements/announcements'
					},
					{
						title: '导出订单',
						img: require('@/static/img/set-9.png'),
						path: '/pages/set/export'
					},
					{
						title: '操作记录',
						img: require('@/static/img/set-11.png'),
						path: '/pages/Permissions/records'
					},
					{
						title: '其他',
						img: require('@/static/img/set-10.png'),
						path: '/pages/set/other'
					}
				]
			};
		},
		methods: {
			toPath(item) {
				uni.navigateTo({
					url: item.path
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.c-box {
	padding: 40rpx 34rpx 0;
	box-sizing: border-box;
	background-color: #FFF;
	border-radius: 10rpx;
	.fcc {
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.img-b {
		width: 100%;
		height: 54rpx;
		margin-bottom: 16rpx;
		.img {
			width: 54rpx;
		}
	}
	
	.title {
		font-size: 24rpx;
		font-weight: 400;
		color: #333333;
		margin-bottom: 39rpx;
	}
}
</style>
<style>
	page {
		background-color: #F4F5F7;
		padding: 20rpx;
		box-sizing: border-box;
	}
</style>
